<!-- 出库管理 -->
<template>
	<view style="padding: 50rpx;">
		<!-- 搜索框 -->
		<view
			style="width: 100%;background-color: white;position: fixed;display: flex;padding: 15rpx;margin-top: -50rpx;">
			<u--input placeholder="输入产品名称搜索" prefixIcon="search" prefixIconStyle="font-size: 22px;"
				style="flex: 1;"></u--input>
			<button style="height: 80rpx;line-height: 80rpx;background-color: #2CB7FF;right: 100rpx;">搜索</button>
		</view>
		<view style="height: 60rpx;"></view>
		<u-subsection :list="list1" :current="current" @change="change1"></u-subsection>
		<!-- 内容 -->
		<view
			style="display: flex;flex-direction: column; background-color: white;border-radius: 10rpx; padding: 20rpx;font-weight: bold;margin-bottom: 20rpx;">
			<view style="display: flex;">
				<view style="flex: 1;">产品名称：<text class="titles">张三</text></view>
				<view
					style="background-color: aquamarine; width: 150rpx;border-radius: 5rpx;text-align: center;line-height: 50rpx;margin-top: 10rpx; height: 50rpx;font-weight: bold;">
					未通过</view>
			</view>
			<view style="flex: 1;">型号：<text class="titles">13288227366</text></view>
			<view style="display: flex;">
				<view>价格：<text class="titles">200</text></view>
				<view style="width: 50rpx;"></view>
				<view>数量：<text class="titles">21</text></view>
			</view>
			<view>是否含税：<text class="titles">是</text></view>
			<view>订单描述：<text
					class="titles">瓦达大大我的挖的挖打唔打瓦达我打我打我打我打阿达娃蛙爱回答我可抵扣啊我尽快打完快进到哈维金卡我尽快大会未打卡阿肯德基啊我打完就打我啊我肯定会瓦坎达瓦坎达啊我肯德基啊温度计啊网卡都可大
				</text></view>
			<image src="../../static/xj.png" style="width: 200rpx;height: 200rpx;"></image>
			<view style="display: flex;">
				<view class="hsbtn" @click="filesInfo()">出库申请</view>
				<!-- 				<view class="hsbtn" style="background-color: green;" @click="filesInfo()">入库通过</view>
				<view class="hsbtn" style="background-color: red;" @click="filesInfo()">入库不通过</view> -->
			</view>

			<!-- //申请出库 -->
			<u-popup :show="show2" @close="show2 =false" @open="open2">
				<view style="height: 1200rpx;">
					<view style=" margin: 30rpx;">
						<text style="margin-top: 10rpx; color: gray;">出库申请人：</text>
						<view style="height: 10rpx;"></view>
						<u--input placeholder="出库申请人" border="surround" v-model="info.company"></u--input>
					</view>
					<view style=" margin: 30rpx;">
						<text style="margin-top: 10rpx; color: gray;">出库价格：</text>
						<view style="height: 10rpx;"></view>
						<u--input placeholder="请输入出库价格" border="surround" v-model="info.company"></u--input>
					</view>
					<view style=" margin: 30rpx;">
						<text style="margin-top: 10rpx; color: gray;">出库数量：</text>
						<view style="height: 10rpx;"></view>
						<u--input placeholder="出库数量" border="surround" v-model="info.company"></u--input>
					</view>

					<!-- 出库类型 -->
					<u-picker :show="show3" :columns="columns3" keyName="label" @confirm="confirm3"
						@cancel="show3=false"></u-picker>
					<view style=" margin: 30rpx;">
						<text style="margin-top: 10rpx; color: gray;">出库类型：</text>
						<view style="height: 10rpx;"></view>
						<view class="iptop" @click="show3=true"><text style="margin-left: 10rpx;">{{khName1}}</text>
						</view>
					</view>
					
					<view style=" margin: 30rpx;">
						<text style="margin-top: 10rpx; color: gray;">出库时间：</text>
						<view style="height: 10rpx;"></view>
						<view class="example-body">
							<uni-datetime-picker type="datetime" v-model="info.remindTime" @change="changeLog" />
						</view>
					</view>

					<view style=" margin: 30rpx;">
						<text style="margin-top: 10rpx; color: gray;">出库原因：</text>
						<view style="height: 10rpx;"></view>
						<view style="border-radius: 10rpx;border: 1rpx solid gray;">
							<textarea rows="4" cols="40" style="margin:10rpx; width: 95%;height: 150rpx;"></textarea>
						</view>
					</view>

					<button
						style="background-color: black;border-radius: 10rpx;color: white;margin: 50rpx;">申请出库</button>
				</view>
			</u-popup>
		</view>




	</view>
</template>

<script>
	export default {
		data() {
			return {
				list1: ['全部', '已入库', '待审核', "入库失败", "待财务审核"],
				current: 0,
				show2: false,
				show3: false, //出库类型
				khName1:"---选择类型---",
				columns3: [
					[{
						label: "卖出商品",
						value: 0
					}, {
						label: "员工借出",
						value: 1
					}]
				],
			};
		},
		methods: {
			//出库申请
			filesInfo(i) {
				this.show2 = true;
			},
			//关闭遮罩层
			close1() {
				this.show1 = false;
			},
			//分段器
			change1(e) {
				this.current = e
			},
			confirm3(e){
				this.khName1 = e.value[0].label
				this.show3 =false
			}
		}
	}
</script>

<style lang="less">
	page {
		background-color: #f1f1f1;
	}

	.titles {
		color: gray;
		font-size: 30rpx;
	}

	.hsbtn {
		margin: 10rpx;
		background-color: black;
		color: white;
		width: 200rpx;
		margin-top: 10rpx;
		height: 60rpx;
		line-height: 60rpx;
		text-align: center;
		border-radius: 5rpx;
	}
	.iptop {
		background-color: white;
		padding-top: 10rpx;
		padding-bottom: 10rpx;
		height: 50rpx;
		line-height: 50rpx;
		width: 100%;
		border-radius: 10rpx;
		border: 1rpx solid #E0E0E3;
	}
</style>